<template>
<!-- 支付成功页面 -->
  <div class="paySuccess">
    <!-- 导航栏 -->
    <van-nav-bar
      class="page-nav-bar"
      title="支付成功"
    >
      <van-icon
        slot="left"
        name="arrow-left"
        @click="$router.push({name:'/'})"
      />
      <!-- $router.back() -->
    </van-nav-bar>
    <!-- 提交成功的主体部分 -->
    <div class="main">
      <img src="@/photo/gou.png" alt="">
      <div>恭喜你成功支付</div>
      <div>前往"<router-link to="/order">我的订单</router-link>"中查看</div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'paySuccess',
  data () {
    return {

    }
  },
  created () {

  },
  mounted () {

  },
  methods: {

  }
}
</script>

<style scoped lang="less">
.page-nav-bar {
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #e70201;
    /deep/ .van-icon-arrow-left {
      color: #fff;
      font-size: 55px;
    }
    /deep/ .van-nav-bar__title {
      color: #fff;
      font-size: 40px;
    }
  }
  .main {
    display: flex;
    flex-direction: column;
    margin-top: 92px;
    align-items: center;
    height: 1142px;
    font-size: 40px;
    img {
      width: 300px;
      margin-top: 100px;
    }
    div {
      margin-top: 20px;
      line-height: 2;
    }
  }
</style>
